<template>
    <div>
        <table>
        <thead><tr>
            <th>书名：</th>
            <th><input type="text"  v-model="obj.bookName"></th>

        </tr>
        <tr>
            <th>作者：</th>
            <th><input type="text" v-model="obj.author"></th>

        </tr>
        <tr>
            <th><input type="button" value="提交" @click="saveBtn()"></th>
            <th><input type="button" value="返回" @click="calBtn()"></th>
        </tr></thead>
    </table>
    </div>
</template>
<script setup>
import { useRouter,useRoute } from "vue-router";
import { computed,ref } from "vue";
import axios from "axios"
let route=new useRoute()
let router=new useRouter()

let obj=ref(
    {
        bookName:"",
        author:""
    }
    
)
console.log( route.params.id );
let id=route.params.id 
if (id) {
axios.get(`http://localhost:5000/book/${id}`).then(res=>{
  let data=res.data.data
  obj.value=data

    
})


}
const saveBtn=  function () {  
   
 if (id) {
    axios.put(`http://localhost:5000/book/${id}`,obj.value)
    router.push('/') 
 } else {
    axios.post("http://localhost:5000/book",obj.value)
    router.push('/')  
 }
}
const calBtn=function () {
router.push('/')    
}

</script>